
<section class="content-header">
    <h1>
      义不容辞之事，当无怨无悔
      <small>乐乐的每日一句</small>
    </h1>
    <ol class="breadcrumb">
      <li><a href="#"><i class="fa fa-dashboard"></i> 文章管理</a></li>
      <li class="active">创建文章</li>
    </ol>
  </section>
  <!-- Main content -->
  <section class="content">
<div class="box box-info">
     <form class="form-horizontal" id="forms"> 
        <div class="box-body">
          <div class="form-group">
            <label for="inputEmail3" class="col-sm-2 control-label">项目标题</label>
            <div class="col-sm-8">
              <input type="text" class="form-control" id="inputEmail3" name="title" placeholder="项目标题">
             <input style="" id="userid" type="text" value=<%= id %> >
            </div>
          </div>
          <div class="form-group">
            <label class="col-sm-2 control-label">项目描述</label>
            <div class="col-sm-8">
                <textarea class="form-control" rows="3" placeholder="请输入项目的简短描述" name="desc" id="desc"></textarea>
              </div>
          </div>
          <div class="form-group">
            <label class="col-sm-2 control-label">项目封面</label>
            <div class="col-sm-8">
                <input id="uploadImg" type="file" class="file" data-preview-file-type="text">
                <input type="text" value="" id="logos" name="logo" style="height:0px;border:0px;margin:0px;padding:0px">
            </div>
         </div>
         <div class="form-group">
            <label for="inputEmail3" class="col-sm-2 control-label">项目地址</label>
            <div class="col-sm-8">
              <input type="text" class="form-control" id="projectUrl" name="projectUrl" placeholder="项目地址">
            </div>
          </div>
          <!-- <div class="form-group">
            <label for="inputEmail3" class="col-sm-2 control-label">历程持续时间</label>
           <div class="input-group col-sm-8" style="padding-left:15px !important;padding-right:15px !important">
            <div class="input-group-addon">
              <i class="fa fa-calendar"></i>
            </div>
            <input type="text" class="form-control pull-right" id="reservation">
          </div>
          </div> -->
          <div class="form-group">
            <label for="inputEmail3" class="col-sm-2 control-label">开始时间:</label>
            <div class="input-group date col-sm-8" style="padding-left:15px !important;padding-right:15px !important">
              <div class="input-group-addon">
                <i class="fa fa-calendar"></i>
              </div>
              <input type="text" class="form-control pull-right" id="datepicker">
            </div>
            <!-- /.input group -->
          </div>
          <div class="form-group">
            <label for="inputEmail3" class="col-sm-2 control-label">结束时间:</label>
            <div class="input-group date col-sm-8" style="padding-left:15px !important;padding-right:15px !important">
              <div class="input-group-addon">
                <i class="fa fa-calendar"></i>
              </div>
              <input type="text" class="form-control pull-right" id="datepicker2">
            </div>
            <!-- /.input group -->
          </div>
        </div>
        <!-- /.box-body -->
        <div class="box-footer">
          <button type="button" class="btn btn-info pull-right" id="lanuchs"  onclick="submits('0')">保存</button>
         <button type="button" class="btn btn-warning pull-middle" id="lanuch"  onclick="submits('1')">发布</button>
        </div>
        <!-- /.box-footer -->
      </form>
</div>


</section>


<script type="text/javascript">
function submits (data){
                            $('#forms').data('bootstrapValidator').validate();//启用验证
                            var flag = $('#forms').data('bootstrapValidator').isValid()//验证是否通过true/false
                            if(flag){
                                projectMark = $('#userid').val()
                                title = $('#inputEmail3').val()
                                desc = $('#desc').val()
                                projectUrl = $('#projectUrl').val()
                                startTime=$('#datepicker').val()
                                endTime=$('#datepicker2').val()
                                projectlog=$('#logos').val()
                                $.post(localhost+"/project/projectAction", { //jq的post方法
                                    projectTitle:title,
                                    projectDesc: desc,
                                    status:data,
                                    projectUrl:projectUrl,
                                    startTime:startTime,
                                    endTime:endTime,
                                    projectlog: projectlog,
                                    projectMark:projectMark
                                }, function(res) {
                                    swal.fire({
                                        type: res.type,
                                        title: res.message
                                    })
                                    .then((value) => {
                                            switch (value) {
                                                default:
                                                if(res.type =='success'){
                                                    // window.location.replace(localhost+"/manarticle");
                                                    $('.content-wrapper').load(localhost + "/project");
                                                }
                                            }
                                            }
                                        );
                                    if(res.type =='success'){
                                        // window.location.replace(localhost+"/manarticle");
                                    }
                                   
                                })
                            }else{
                                Toast.fire({
                                        type: 'info',
                                        title: '请完善文章信息'
                                    })
                            }
                        };
 const Toast = Swal.mixin({
      toast: true,
      position: 'middle',
      showConfirmButton: false,
      timer: 3000
    });
$(document).ready(function() {              
    $(".select2").select2();
     //Date range picker
     $('#datepicker').datepicker({
      autoclose: true
    });
    $('#datepicker2').datepicker({
      autoclose: true
    });
    $('#forms').bootstrapValidator({
      message: 'This value is not valid',
         feedbackIcons: {
             valid: 'glyphicon glyphicon-ok',
             invalid: 'glyphicon glyphicon-remove',
             validating: 'glyphicon glyphicon-refresh'
         },
      
      fields: {
        title: {
                validators: {  
                      notEmpty: {                        
                        message: '请填写项目名'                     
                      }
                                   
                    }             
                },
          desc: {
            validators: {  
                  notEmpty: {                        
                    message: '请填写项目描述'                     
                  }

                }             
            },
            projectUrl:{
              validators: {  
                  notEmpty: {                        
                    message: '请填写项目地址'                     
                  }

                }  
            }
    }
    })
     

function getCookie(cookie_name) {
        var stringResult = '<%= id%>'.split(';');
        console.log(stringResult[2])
        var allcookies = document.cookie;
		//索引长度，开始索引的位置
        var cookie_pos = allcookies.indexOf(cookie_name);

        // 如果找到了索引，就代表cookie存在,否则不存在
        if (cookie_pos != -1) {
            // 把cookie_pos放在值的开始，只要给值加1即可
            //计算取cookie值得开始索引，加的1为“=”
            cookie_pos = cookie_pos + cookie_name.length + 1; 
            //计算取cookie值得结束索引
            var cookie_end = allcookies.indexOf(";", cookie_pos);
            
            if (cookie_end == -1) {
                cookie_end = allcookies.length;

            }
            //得到想要的cookie的值
            var value = unescape(allcookies.substring(cookie_pos, cookie_end)); 
        }
        return value;
    }

                 
                   
                

$("#forms").submit(function(e){ //uploadVideoForm为表单名称
   e.preventDefault()
});
function imgSrcToBase64(img) {
    var canvas = document.createElement("canvas");
    canvas.width = img.width;
    canvas.height = img.height;
    var ctx = canvas.getContext("2d");
    ctx.drawImage(img,0,0,img.width,img.height);
    return canvas.toDataURL();
}
 
initFileInput();
function initFileInput() {
    $("#uploadImg").fileinput({
        language: 'zh', //设置语言
        dropZoneTitle: '可以将图片拖放到这里 …支持多文件上传',
        uploadUrl: localhost+'/project/addimage', //上传的地址
        uploadExtraData: function(previewId, index) {   //该插件可以向您的服务器方法发送附加数据。这可以通过uploadExtraData在键值对中设置为关联数组对象来完成。所以如果你有设置uploadExtraData={id:'kv-1'}，在PHP中你可以读取这些数据$_POST['id']
         ids =  $('#id').val()
        // var id = ids == null || undefined || '' ? 'imgs123': ids;
        
            return {seriesId: ids};
        },
        allowedFileExtensions: ['jpg','png'],//接收的文件后缀
        uploadAsync: true, //默认异步上传
        showUpload: true, //是否显示上传按钮
        showRemove: true, //显示移除按钮
        showPreview: true, //是否显示预览
        showCancel:true,   //是否显示文件上传取消按钮。默认为true。只有在AJAX上传过程中，才会启用和显示
        showCaption: false,//是否显示文件标题，默认为true
        browseClass: "btn btn-primary", //文件选择器/浏览按钮的CSS类。默认为btn btn-primary
        dropZoneEnabled: false,//是否显示拖拽区域
        minImageWidth: 50, //图片的最小宽度
        minImageHeight: 50,//图片的最小高度
        maxImageWidth: 5000,//图片的最大宽度
        maxImageHeight: 5000,//图片的最大高度
        maxFileSize: 0,//单位为kb，如果为0表示不限制文件大小
        minFileCount: 1, //每次上传允许的最少文件数。如果设置为0，则表示文件数是可选的。默认为0
        maxFileCount: 0, //每次上传允许的最大文件数。如果设置为0，则表示允许的文件数是无限制的。默认为0
        previewFileIcon: "<i class='glyphicon glyphicon-king'></i>",//当检测到用于预览的不可读文件类型时，将在每个预览文件缩略图中显示的图标。默认为<i class="glyphicon glyphicon-file"></i>  
        layoutTemplates:{
            actionUpload:'',//去除上传预览缩略图中的上传图片
            actionZoom:'',   //去除上传预览缩略图中的查看详情预览的缩略图标
            actionDownload:'', //去除上传预览缩略图中的下载图标
            actionDelete:'', //去除上传预览的缩略图中的删除图标
        },//对象用于渲染布局的每个部分的模板配置。您可以设置以下模板来控制窗口小部件布局.eg:去除上传图标
        msgFilesTooMany: "选择上传的文件数量({n}) 超过允许的最大数值{m}！",//字符串，当文件数超过设置的最大计数时显示的消息 maxFileCount。默认为：选择上传的文件数（{n}）超出了允许的最大限制{m}。请重试您的上传！
    }).on('filebatchpreupload', function(event, data) { //该方法将在上传之前触发
        var id = $('#id option:selected').val();
        if(id == 0){
            return {
                message: "请选择", // 验证错误信息在上传前要显示。如果设置了这个设置，插件会在调用时自动中止上传，并将其显示为错误消息。您可以使用此属性来读取文件并执行自己的自定义验证
                data:{id : $('#id').val()} // any other data to send that can be referred in `filecustomerror`
            };
        }
    });
}
//fileuploaded此事件仅针对ajax上传触发，并在每个缩略图文件上传完成后触发。此事件仅针对ajax上传并在以下情况下触发：当点击每个预览缩略图中的上传图标并且文件上传成功时，或者当你有 uploadAsync设置为true您已触发批量上传。在这种情况下，fileuploaded每一个人选择的文件被上传成功后，触发事件。
var id_str = 1;
$('#uploadImg').on('fileuploaded', function(event, data, previewId, index) {
    var val = data.response
    if(val){
       console.log(data.response)
       val =val.replace('/usr/local/boke-pro/bokenews/public','http://lele.daxunxun.com:9000')
       $('#logos').val(val)
       var val =  $('#logos').val()
    
    }
});
// filebatchuploadcomplete此事件仅在ajax上传和完成同步或异步ajax批量上传后触发。
});
</script>



  